<!-- <%@ page contentType="text/html;charset=UTF-8" language="java" %> -->
<!DOCTYPE html>
<html lang="zh">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,uesr-scalable=no">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" href="./css/reset.css">
  <link rel="stylesheet" href="./css/index.css">
  <link rel="stylesheet" href="./css/inde-c3.css">
  <link rel="stylesheet" href="./css/personal-detail.css">
  <link rel="stylesheet" href="./font-awesome-4.7.0/css/font-awesome.min.css">
</head>

<body>
<div class="objConter">
  <div class="leftFixlis">
    <div class="fixTophead"><img src="./images/detail-data-tu.gif" alt=""></div>
    <div class="fixCont">
      <ul>
        <a href="index.jsp">
          <li class="mouseclick"> <i class="fa fa-question"></i> 问答库 <i class="fa fa-chevron-right"></i>
          </li>
        </a>
        <a href="">
          <li class="mouseclick"> <i class="fa fa-book"></i> 资料库 <i class="fa fa-chevron-right"
                                                                    style="display:none"></i>
          </li>
        </a>
        <a href="/DownLoadS?method=selectAllVideo">
          <li class="mouseclick"> <i class="fa fa-play-circle"></i> 云视频 <i class="fa fa-chevron-right"
                                                                           style="display:none"></i></li>
        </a>

        <a href="">
          <li class="mouseclick"> <i class="fa fa-comments-o"></i> 社交互动 <i class="fa fa-chevron-right"
                                                                           style="display:none"></i></li>
        </a>



      </ul>

    </div>
  </div>
  <div class="conterTop">
    <div class="topCont clearBox">
      <div class="topLeft">
        <ul class="topLeft-font">
          <a href="">
            <li class="mouseclick"><i class="fa fa-home"></i>主页</li>
          </a>
          <a href="">
            <li class="mouseclick cta">我的学习</li>
          </a>
          <a href="">
            <li class="mouseclick cta">我的班级</li>
          </a>
          <a href="">
            <li class="mouseclick"> <i class="fa fa-th"></i>更多功能</li>
          </a>
          <li class="mouseclick clearBox" id="top-seek">
            <form action="">
              <input type="text" placeholder="视频名称">
              <!-- <button class="fa fa-search"></button> -->
              <input type="submit" value="">
            </form>

          </li>
        </ul>
      </div>
      <div class="topRight">
        <ul class="topRight-font clearBox">
          <a href="javascript:;">
            <li class="rightlis selectFar mouseclick"><img src="./images/detail-data-tu.gif" alt=""
                                                           class="headPh">
              <ul class="selectCont">
                <a href="javascript:;">
                  <li class="mouseclick cta" id="mater">个人资料</li>
                </a>
                <a href="">
                  <li class="mouseclick cta">使劲更改</li>
                </a>
                <a href="">
                  <li class="mouseclick cta">使劲更改</li>
                </a>
              </ul>
            </li>
          </a>
          <a href="">
            <li class="rightlis mouseclick"><i class="fa fa-bell"></i> 消息
            </li>
          </a>
          <a href="pages/qiandao.html">
            <li class="rightlis mouseclick"> <i class="fa fa-calendar-check-o"></i> 签到</li>
          </a>
        </ul>
      </div>
    </div>
  </div>
  <div class="conterQuestion">
    <div class="questionTitle clearBox">
      <div class="questionLeft"> <i class="fa fa-info"></i> <span>问答库</span></div>
      <div class="questionRight"><i class="fa fa-home"></i> <span>首页 · 问答库</span></div>
    </div>
    <div class="questionCont clearBox">
      <div class="questionCont-Left">
        <div class="Left-seekques clearBox">
          <div class="seekSet mouseclick">详细 <i class="fa fa-caret-up sign "></i></div>
          <div class="seeKsets" style="display:none">
            <div id="seeKacitve" class="mouseclick cta">详细</div>
            <div class="mouseclick cta">关键词</div>
          </div>
          <form class="seekWord clearBox">
            <input type="text" name="keyword" id="" placeholder="请输入关键词搜索" autocomplete="off">
            <input type="submit" class="cta mouseclick" value="搜索" id="btn">
          </form>
        </div>
        <div class="Left-showques">
          <div class="showquesTitle clearBox">
            <span class="showLis">序号</span>
            <span class="showTitle">问题文章</span>
          </div>
          <div class="showquesCont">
            <!-- 渲染数据模块  自行修改-->

            <div class="clearBox">
              <span>一</span>
              <span>问题解答内容</span>
            </div>

            <!-- ------------------ -->
          </div>

        </div>
      </div>
      <div class="questionCont-Right">
        <div>标签/正文<span></span></div>
        <div>问题模块<span></span></div>
      </div>
    </div>

  </div>





  <div class="material" style="display:none">
    <div class="personal-r f-r">
      <div class="personal-right">
        <div class="personal-r-tit">
          <h3><i class="fa fa-address-book-o fa-lg"></i>&nbsp;&nbsp;个人资料</h3>
          <i class="fa fa-compress fa-2x mouseclick" id="mateBtn"></i>
        </div>
        <div class="data-con">
          <div class="dt1">
            <p class="f-l"><i class="fa fa-camera-retro fa-lg"></i>&nbsp;&nbsp;当前头像：</p>
            <div class="touxiang f-l" id="mouseclick">
              <div class="tu f-l">
                <a href="#">
                  <img src="./images/detail-data-tu.gif" />
                  <input type="file" name="" id="" class="img1" />
                </a>
              </div>
              <a href="JavaScript:;" class="sc f-l " id="mouseclick" shangchuang="">上传头像</a>
              <div style="clear:both;"></div>
            </div>
            <div style="clear:both;"></div>
          </div>
          <div class="dt1">
            <p class="dt-p f-l"> <i class="as fa fa-user-circle-o fa-lg"></i>&nbsp;&nbsp;昵称：</p>
            <input type="text" placeholder="请输入昵称" />
            <div style="clear:both;"></div>
          </div>
          <div class="dt1">
            <p class="dt-p f-l"><i class="fa fa-user-o fa-lg"></i> &nbsp;&nbsp;用户名：</p>
            <input type="text" placeholder="请输入你的用户名" value="全栈" />
            <div style="clear:both;"></div>
          </div>
          <div class="dt1 dt2">
            <p class="dt-p f-l"><i class="sex fa fa-venus-mars fa-lg"></i>&nbsp;性别：</p>
            <input type="radio" name="hobby" value="nan"></input><span><i class="fa fa-mars fa-lg"></i></span>
            <input type="radio" name="hobby" value="nan"></input><span><i class="fa fa-venus fa-lg"></i></span>
            <div style="clear:both;"></div>
          </div>
          <div class="dt1">
            <p class="dt-p f-l"><i class="age fa fa-birthday-cake fa-lg"></i>&nbsp;&nbsp;年龄：</p>
            <input type="text"  placeholder="请输入您的年龄" value="20" />
            <div style="clear:both;"></div>
          </div>
          <div class="dt1 dt3">
            <p class="dt-p f-l"><i class="phone fa fa-phone-square fa-lg"></i>&nbsp;手机号：</p>
            <input type="text"  placeholder="请输入你的手机号" value="12345678910" />
            <button id="mouseclick">获取短信验证码</button>
            <div style="clear:both;"></div>
          </div>
          <div class="dt1">
            <p class="dt-p f-l"><i class="code fa fa-address-card-o fa-lg"></i>验证码：</p>
            <input type="text" placeholder="请输入你的验证码" value="" />
            <div style="clear:both;"></div>
          </div>
          <div class="dt1">
            <p class="dt-p f-l"><i class="email fa fa-qq fa-lg"></i>&nbsp;&nbsp;邮箱：</p>
            <input type="text"  placeholder="请输入你的邮箱" value="111111111@qq.com" />
            <div style="clear:both;"></div>
          </div>
          <div class="dt1 dt4">
            <p class="dt-p f-l"><i class="password fa fa-address-card-o fa-lg"></i>&nbsp;&nbsp;密码：</p>
            <input type="password" placeholder="请输入你的密码" value="" />
            <button id="mouseclick">修改密码</button>
            <div style="clear:both;"></div>
          </div>
          <button class="btn-pst" id="mouseclick">保存</button>
        </div>
      </div>
    </div>
    <div style="clear:both;"></div>
  </div>

</div>
</div>









</body>
<script src="./js/jquery-3.3.1.js"></script>
<script src="./js/csanimate.js"></script>
<script src="./js/index.js"></script>
<script type="text/javascript" color="0, 0, 0" pointColor="0, 0, 0" opacity='1' zIndex="-2" count="100"
        src="./background-special-effects/dist/canvas-nest.js"></script>
<script type="text/javascript" src="./background-special-effects/dist/canvas-nest.umd.js"></script>
<script type="text/javascript">
    var cn = new CanvasNest(document.getElementById('area-render'), {
        color: '0,0,0',
        count: 50,
    });

    // var scene = document.querySelector('body');
    // var parallax = new Parallax(scene, {
    //     calibrateX: false,
    //     calibrateY: true,
    //     invertX: false,
    //     invertY: true,
    //     limitX: false,
    //     limitY: 10,
    //     scalarX: 2,
    //     scalarY: 8,
    //     frictionX: 0.2,
    //     frictionY: 0.8
    // });
</script>

</html>